<?php
	if(isset($registrationSuccess) && !$registrationSuccess)
	{
		echo renderAlertControl('danger','Registration Failure','Registration has failed, please try again');
	}
?>
<div class="panel panel-primary">
	<!-- Default panel contents -->
	<div class="panel-heading">Signup</div>
	<div class="panel-body">
		<form method="POST" role="form" action="signup.php" id="signup-form" name="signup" enctype="multipart/form-data">

			<hr size="1" class="post-body-seperator" style="color:#e2e1ea">			

			<div>
				<div class="form-group">
					<label for="txtUsername">Username</label>
					<div class="input-group input-group-sm">
						<span class="input-group-addon">
							<i class="glyphicon glyphicon-user"></i>
						</span>	
						<input type="text" name="txtUsername" class="span4 form-control input-sm" id="txtUsername" placeholder="Username" maxlength="10" value="<?php if(isset($regUsername) && !empty($regUsername)){echo $regUsername;} ?>"/>
					</div>
				</div>
			</div>
			
			<div>
				<div class="form-group">
					<label for="txtFirstName">First Name</label> 
					<div class="input-group input-group-sm">
						<span class="input-group-addon">
							<i class="glyphicon glyphicon-user"></i>
						</span>	
						<input type="text" class="form-control input-sm span4" name="txtFirstName" id="txtFirstName" placeholder="First Name" value="<?php if(isset($regFirstName) && !empty($regFirstName)){echo $regFirstName;} ?>" />
					</div>
				</div>
			</div>
			
			<div>
				<div class="form-group">
					<label for="txtLastName">Last Name</label>
					<div class="input-group input-group-sm">
						<span class="input-group-addon">
							<i class="glyphicon glyphicon-user"></i>
						</span>	
						<input type="text" class="form-control input-sm span4" name="txtLastName" id="txtLastName" placeholder="Last Name" value="<?php if(isset($regLastName) && !empty($regLastName)){echo $regLastName;} ?>" />
					</div>
				</div>
			</div>
			
			<div>
				<div class="form-group">
					<label>Gender</label>
					<div class="radio">
						<label>
							<input type="radio" name="sex" id="rbtnMale" value="M" <?php if(isset($regGender) && !empty($regGender) && strcasecmp($regGender,'M')==0){echo 'checked';} ?>>Male 
						</label>
					</div>
					<div class="radio">
						<label>
							<input type="radio" name="sex" id="rbtnFemale" value="F" <?php if(isset($regGender) && !empty($regGender) && strcasecmp($regGender,'F')==0){echo 'checked';} ?>>Female
						</label>
					</div>
				</div>
			</div>
			
			<div>
				<div class="form-group">
					<label for="txtEmail">Email Address</label>
					<div class="input-group input-group-sm">
						<span class="input-group-addon">
							<i class="glyphicon glyphicon-envelope"></i>
						</span>	
						<input type="email" class="form-control input-sm span4" name="txtEmailAddress" id="txtEmailAddress" placeholder="Email Address" value="<?php if(isset($regEmailAddress) && !empty($regEmailAddress)){echo $regEmailAddress;} ?>" /> 
					</div>
				</div>
			</div>
			
			<div>
				<div class="form-group">
					<label for="txtPassword">Password</label>
					<div class="input-group input-group-sm">
						<span class="input-group-addon">
							<i class="glyphicon"></i>
						</span>	
						<input type="password" class="form-control input-sm span4" id="txtPassword" name="txtPassword" placeholder="Password" value="<?php if(isset($regPassword) && !empty($regPassword)){echo $regPassword;} ?>"/>
					</div>
				</div>
			</div>
			
			<div>
				<div class="form-group">
					<label for="txtConfirmPassword">Confirm Password</label>
					<div class="input-group input-group-sm">
						<span class="input-group-addon">
							<i class="glyphicon"></i>
						</span>	
						<input type="password" class="form-control input-sm span4" name="txtConfirmPassword" id="txtConfirmPassword" placeholder="Confirm Password"/> 
					</div>
				</div>
			</div>
			
			<hr size="1" class="post-body-seperator" style="color:#e2e1ea">			
			
			<div>
				<div class="form-group">
					<label for="txtStreet1">Street Address</label>
					<div class="input-group input-group-sm">
						<span class="input-group-addon">
							<i class="glyphicon glyphicon-road"></i>
						</span>	
						<input type="text" name="txtStreet1" id="txtStreet1" class="form-control input-sm span4" value="<?php if(isset($regStreet1) && !empty($regStreet1)){echo $regStreet1;} ?>" />
					</div>
				</div>
			</div>
			
			<div>
				<div class="form-group">
					<label for="txtStreet2">Address 2</label>
					<div class="input-group input-group-sm">
						<span class="input-group-addon">
							<i class="glyphicon glyphicon-road"></i>
						</span>	
						<input type="text" name="txtStreet2" id="txtStreet2" class="form-control input-sm span4" value="<?php if(isset($regStreet2) && !empty($regStreet2)){echo $regStreet2;} ?>"/>
					</div>
				</div>
			</div>
			
			<div>
				<div class="form-group">
					<label for="txtCity">City</label>
					<div class="input-group input-group-sm">
						<span class="input-group-addon">
							<i class="glyphicon glyphicon-globe"></i>
						</span>	
						<input type="text" name="txtCity" id="txtCity" class="form-control input-sm span4" value="<?php if(isset($regCity) && !empty($regCity)){echo $regCity;} ?>" />
					</div>
				</div>
			</div>
			
			<div>
				<div class="form-group">
					<label for="ddlCountry">Country</label>
					<div class="input-group input-group-sm">
						<span class="input-group-addon">
							<i class="glyphicon glyphicon-globe"></i>
						</span>	
						<select class="form-control input-sm  span4" id="ddlCountry" name="ddlCountry">
							<?php 
								renderAllCountryOptions("JAM",$regCountry);
							?>
						</select>
					</div>
				</div>
			</div>

			<hr size="1" class="post-body-seperator" style="color:#e2e1ea">
			
			<div>
				<div class="form-group">
					<label>Home Phone</label>
					<div class="input-group input-group-sm">
						<span class="input-group-addon">
							<i class="glyphicon glyphicon-phone-alt"></i>
						</span>	
						<input type="text" class="form-control input-sm span4" name="txtHomeNumber" id ="txtHomeNumber" maxlength="10" placeholder="Number"  value="<?php if(isset($regHomeContact) && !empty($regHomeContact)){echo $regHomeContact;} ?>" />
					</div>
				</div>
			</div>

			<div>
				<div class="form-group">
					<label>Mobile Phone</label>
					<div class="input-group input-group-sm">
						<span class="input-group-addon">
							<i class="glyphicon glyphicon-phone"></i>
						</span>	
						<input type="text" class="form-control input-sm span4" name="txtMobileNumber" id ="txtMobileNumber" maxlength="10" placeholder="Number"  value="<?php if(isset($regMobileContact) && !empty($regMobileContact)){echo $regMobileContact;} ?>"/>
					</div>
				</div>
			</div>
			
			<div>
				<div class="form-group">					
					<label for="txtAboutme">About Me</label>
					<div class="input-group">
						<span class="input-group-addon">
							<i class="glyphicon glyphicon-user"></i>
						</span>
						<textarea rows="10" cols="75" class="form-control input-sm span6" name="txtAboutme" id="txtAboutme" size="300" placeholder="Tell TicToc Watches about yourself..."><?php if(isset($regAboutMe) && !empty($regAboutMe)){echo $regAboutMe;} ?></textarea>
					</div>
				</div>
			</div>
			
			<hr size="1" class="post-body-seperator" style="color:#e2e1ea">
			
			<div>
				<div class="form-group">
					<label for="fileProfileImg">Upload a Profile Image</label>
					<div class="input-group input-group-sm">
						<span class="input-group-addon">
							<i class="glyphicon glyphicon-camera"></i>
						</span>	
						<input type="file" name="fileProfileImg" class="span4 form-control input-sm" id="fileProfileImg" placeholder="" maxlength="" />
						
					</div>
					<label for="fileProfileImg" class="error"><?php if(isset($profileImgUploadSuccess) && !$profileImgUploadSuccess){echo("File upload failed");} ?></label>
				</div>
			</div>	

			
			<div class="form-group">
				<div>
					<input type="submit" class="btn btn-primary" name="btnRegister" value="Register">
				</div>
			</div>
		</form>
	</div>
</div>